<template>
	<view class="flex flex-column gap-10" >
		<view class="flex flex-column  fs-14 gap-3" v-for="(item,index) in list" :key="index">
			<image :src="item.img" class="w-80 h-80 round-6"></image>
			<view class="flex flex-y-center flex-x-center gap-3">
				<text class="iconfont fs-14"
					:class="item.icon=='success'?'text-green icon-zhengque ':'text-red icon-shanchu3 '"></text>
				<text>{{item.title}}</text>
			</view>
		</view>
	</view>
</template>

<script setup>
	import { reactive } from 'vue';
	const list = reactive([
		{ title: '正脸自拍', icon: 'success', img: '/static/image/01.png' },
		{ title: '可微张口', icon: 'success', img: '/static/image/02.png' },
		{ title: '面部遮挡', icon: 'error', img: '/static/image/03.png' },
	])
</script>

<style>
</style>